<template>
	<tm-fullView>
		<tm-menubars title="消息提示框" color="bg-gradient-primary-lighten" :showback="true"></tm-menubars>
		<tm-sheet :shadow="24">
			<view class="text-size-s text-weight-b mb-24">基本示例</view>
			<tm-alerts label="这是一条静态消息提醒" close></tm-alerts>
			<tm-alerts :black="false" label="强制不暗黑" left-icon=""></tm-alerts>
			<tm-alerts icon-color="primary" text :shadow="0" label="这是一条静态消息提醒" :round="0" close></tm-alerts>
			<tm-alerts icon-color="primary" outlined :shadow="0" :label="{text:'这个消息可以打开链接',url:'/pages/index/index'}"
				rang-key="text" :round="0" url>
			</tm-alerts>
			<tm-alerts icon-color="orange" text color="orange" :shadow="0" label="这是一条静态消息提醒" :round="0" close>
			</tm-alerts>
		</tm-sheet>
		<tm-sheet :shadow="24">
			<view class="text-size-s text-weight-b mb-24">轮播消息,自定义图标</view>
			<tm-alerts :vertical="true" color="bg-gradient-yellow-accent-b" left-icon="icon-QQ"
				:label="['纵向这是二条静态消息提醒','纵向这是二条的消息轮播动态']" close></tm-alerts>

		</tm-sheet>
		<tm-alerts :margin="[32,0]" color="bg-gradient-pink-accent-b" left-icon="icon-QQ"
			:label="['默认横向这是二条静态消息提醒','默认横向这是二条的消息轮播动态']" close></tm-alerts>
	</tm-fullView>

</template>

<script>
	import tmFullView from "@/tm-vuetify/components/tm-fullView/tm-fullView.vue"
	import tmMenubars from "@/tm-vuetify/components/tm-menubars/tm-menubars.vue"
	import tmSheet from "@/tm-vuetify/components/tm-sheet/tm-sheet.vue"
	import tmAlerts from "@/tm-vuetify/components/tm-alerts/tm-alerts.vue"
	export default {
		components: {
			tmFullView,
			tmMenubars,
			tmSheet,
			tmAlerts
		},
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>

</style>
